<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>第一个vue项目案例</title>
    <script src="./js/vue.js"></script>
</head>
<body>
    <div id="app">
        <h1>{{ message }}</h1>
        {{ quanquan }}
        <h4>用户名:{{user.name}}</h4>
        <h4>性别:{{ user.sex=='女'}}</h4>
        <h4>判断:{{ 1=='1'}}</h4>   
        <h4>角色:{{ user.type=='1'?'管理员':'游客'}}</h4>   
    </div>
</body>
</html>
<script>

    const app = new Vue({
        el: '#app',     //element用来给Vue实例定义一个作用范围
        data: {
            //用来给Vue实例定义一些相关数据
            message: 'Hello Vue!',
            quanquan:'全全',
            user:{
                name:'李四',
                sex:'男',
                type:1    //1.管理员   不是1的是游客
            }
        }
    })
</script>